import React, { useState, useEffect } from 'react'
import { DatePicker, Form, Space, Button } from 'antd'
import { DownloadOutlined, SearchOutlined } from '@ant-design/icons'
import { FilterContainer } from '@/appComponents/Filter'
import dayjs from 'dayjs'
const dateFormat = 'YYYY-MM-DD'
const Filter = ({ onQuery, paramsData, setParamsData }) => {
  const onQueryChange = (v, t) => {
    setParamsData((state) => {
      state[t] = dayjs(v).format(dateFormat)
      return {
        ...state
      }
    })
  }

  const click = () => {
    let newParamsData = {}
    for (let key in paramsData) {
      if (paramsData[key] != (-1 || '-1')) {
        newParamsData[key] = paramsData[key]
      }
    }
    onQuery && onQuery(newParamsData)
  }
  return (
    <FilterContainer>
      <Form name="horizontal_login" layout="inline">
        <Form.Item label="时间：">
          <DatePicker
            showToday
            defaultValue={dayjs(paramsData.warn_time)}
            format={dateFormat}
            onChange={(v) => {
              onQueryChange(v, 'warn_time')
            }}
          />
        </Form.Item>
        <Form.Item>
          <Space>
            <Button
              type="primary"
              onClick={() => click('query')}
              icon={<SearchOutlined></SearchOutlined>}
            >
              查询
            </Button>
          </Space>
        </Form.Item>
      </Form>
    </FilterContainer>
  )
}

export default Filter
